<!-- widget grid -->
<section id="widget-grid" class="">

    <!-- row -->
    <div class="row">

        <!-- NEW WIDGET START -->
        <article class="col-sm-12">

            <!-- Widget ID (each widget will need unique ID)-->
            <div class="jarviswidget well" id="wid-id-0">
                <!-- widget options:
                usage: <div class="jarviswidget" id="wid-id-0" data-widget-editbutton="false">

                data-widget-colorbutton="false"
                data-widget-editbutton="false"
                data-widget-togglebutton="false"
                data-widget-deletebutton="false"
                data-widget-fullscreenbutton="false"
                data-widget-custombutton="false"
                data-widget-collapsed="true"
                data-widget-sortable="false"

                -->
                <header>
                    <span class="widget-icon"> <i class="fa fa-comments"></i> </span>
                    <h2>My Data </h2>

                </header>

                <!-- widget div-->
                <div>

                    <!-- widget edit box -->
                    <div class="jarviswidget-editbox">
                        <!-- This area used as dropdown edit box -->

                    </div>
                    <!-- end widget edit box -->

                    <!-- widget content -->
                    <div class="widget-body">

                        <div id="nestable-menu">
                            <button type="button" class="btn btn-default" data-action="expand-all">
                                展开所有
                            </button>
                            <button type="button" class="btn btn-default" data-action="collapse-all">
                                关闭所有
                            </button>
                            <a href="#{:U('Exam/addColg')}" class="btn btn-primary">添加学院</a>
                        </div>
                        <div class="row">

                            <div class="col-sm-6 col-lg-12">

                                <div class="dd" id="nestable3">
                                    
                                    <ol class="dd-list">
                                        <volist name='datas' id='v'>
                                            
                                        <li class="dd-item dd3-item" data-id="{$v.id}">
                                            <div class="dd-handle dd3-handle">
                                                Drag
                                            </div>
                                            <div class="dd3-content" title="{$v.name}介绍：{$v.description}">
                                                {$v.name}

                                                <div class="pull-right">
                                                    <div class="checkbox no-margin">
                                                        <label>
                                                            <a class="btn-sm btn-success" href="#{:U('Exam/editcolg',array('id'=>$v['id']))}">修改</a>
                                                            <a class="btn-sm btn-danger delcolg" data-id='{$v.id}' href="javascript:;">删除</a>
                                                            <a class="btn-sm btn-primary" href="#{:U('Exam/addcolg',array('pid'=>$v['id']))}">添加专业</a>
                                                        </label>
                                                    </div>
                                                </div>

                                            </div>
                                            
                                            <notempty name='v._child'>
                                                
                                            <ol class="dd-list">
                                                <volist name='v._child' id='vc'>

                                                <li class="dd-item dd3-item" data-id="{$vc.id}">
                                                    <div class="dd-handle dd3-handle">
                                                        Drag
                                                    </div>
                                                    <div class="dd3-content" title="{$vc.name}介绍：{$vc.description}">
                                                        {$vc.name}
                                                        <div class="pull-right">
                                                            <div class="checkbox no-margin">
                                                                <label>
                                                                    <a class="btn-sm btn-success" href="#{:U('Exam/editcolg',array('id'=>$v['id']))}">修改</a>
                                                                    <a class="btn-sm btn-danger delcolg" data-id='{$vc.id}' href="javascript:;">删除</a>
                                                                </label>
                                                            </div>
                                                        </div>
                                                    </div>    
                                                </li>
                                                </volist>
                                            </ol>
                                                
                                            </notempty>
                                        </li>
                                            
                                        </volist>
                                        
                                    </ol>
                                </div>

                            </div>

                        </div>

                    </div>
                    <!-- end widget content -->

                </div>
                <!-- end widget div -->

            </div>
            <!-- end widget -->

        </article>
        <!-- WIDGET END -->

    </div>

    <!-- end row -->

    <!-- row -->

    <div class="row">

        <div class="col-sm-12">

            <div class="well well-sm well-light">
                <textarea id="nestable2-output" rows="3" class="form-control font-md"></textarea>			
            </div>


        </div>

    </div>

    <!-- end row -->

</section>
<!-- end widget grid -->

<script type="text/javascript">
    // DO NOT REMOVE : GLOBAL FUNCTIONS!
    pageSetUp();

    // PAGE RELATED SCRIPTS
    
    loadScript("__STATIC__/smart_admin/js/plugin/jquery-nestable/jquery.nestable.js", runNestables);

    function runNestables() {

        var updateOutput = function(e) {
            var list = e.length ? e : $(e.target), output = list.data('output');
            if (window.JSON) {
                output.val(window.JSON.stringify(list.nestable('serialize')));
                //, null, 2));
            } else {
                output.val('JSON browser support required for this demo.');
            }
        };

        // activate Nestable for list 3
        $('#nestable3').nestable({
            group: 1
        }).on('change', updateOutput);

        // output initial serialised data
        updateOutput($('#nestable3').data('output', $('#nestable2-output')));

        $('#nestable-menu').on('click', function(e) {
            var target = $(e.target), action = target.data('action');
            if (action === 'expand-all') {
                $('.dd').nestable('expandAll');
            }
            if (action === 'collapse-all') {
                $('.dd').nestable('collapseAll');
            }
        });

    }

    $('.delcolg').on('click',function(){
            var $this = $(this);
            var id = $this.attr('data-id');
            $.SmartMessageBox({
                    title : "删除",
                    content : "是否删除此项信息",
                    buttons : '[No][Yes]'
            }, function(ButtonPressed) {
                    if (ButtonPressed === "Yes") {

                        $.post('{:U("Exam/delColg")}',{id:id},function(data,status){
                            if(data.status == 1){
                                $this.parents('li:first').remove();
                            }
                            $.smallBox({
                                    title : "操作提示",
                                    content : data.info,
                                    color : "#a90329",
                                    iconSmall : "fa fa-check fa-2x fadeInRight animated",
                                    timeout : 4000
                            });
                        });
                    }
                    if (ButtonPressed === "No") {

                    }

            });
    })
</script>
